/**
 * 匠言知识付费v3.0.0
 * Author: 山西匠言网络科技有限公司
 * 这不是一个免费软件，它受限于许可条款，你可以访问https://www.zsfzxkc.cn/获取更多详细信息。
 * This is not a free software, it under the license terms, you can visit https://www.zsffzxkc.cn/ get more details.
 */
<template>
	<view>
		<view class="box">
			<view v-for="(item,index) in footerList" :key="index" class="nav" :class="[{newstyle1:mpsh}]" @click="handleChangeCurrentPage(item)">
				<view class="itemtt">
					<image class="icon-img" v-if="item.footer_ind !=3 || !has_notReadMsg" :src="current_ind == item.footer_ind?item.icon2:item.icon" mode="aspectFit"></image>
					<uni-badge :text="dot_text" v-if="item.footer_ind ==3 && has_notReadMsg==true" type='error' size="small" absolute="rightTop"><image class="icon-img" :src="current_ind == item.footer_ind?item.icon2:item.icon" mode="aspectFit"></image></uni-badge>
					<text class="texttt" :style="current_ind == item.footer_ind ? 'color:#4b89ff' : 'color:#9B9B9B'">{{item.name}}</text>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		name:"jy-navbar",
		props:['current_index'],
		data() {
			return {
				current_ind : this.current_index,
				footerList: [
					{
						icon: '/static/andy-ADTabbar/home.png',
						icon2: '/static/andy-ADTabbar/home2.png',
						name: '首页',
						footer_ind: 1,
						page_route: '/pages/index/index'
					},
					{
						icon: '/static/andy-ADTabbar/video.png',
						icon2: '/static/andy-ADTabbar/video2.png',
						name: '精选',
						footer_ind: 2,
						page_route: '/pages/course-list/course-list'
					},
					{
						icon: '/static/andy-ADTabbar/msg.png',
						icon2: '/static/andy-ADTabbar/msg2.png',
						name: '消息',
						footer_ind: 3,
						page_route: '/pages/message/message'
					},
					{
						icon: '/static/andy-ADTabbar/my.png',
						icon2: '/static/andy-ADTabbar/my2.png',
						name: '我的',
						footer_ind: 4,
						page_route: '/pages/user/user'
					}
				],
				base_set:[],
				mpsh:true,
				dot_text:0,
				has_notReadMsg:false
			};
		},
		watch: {
		    current_index(newVal) {
				this.current_ind = newVal //对父组件传过来的值进行监听，如果改变也对子组件内部的值进行改变
		    }
		},
		created() {
			this.dot_text = getApp().globalData.dot_text;
			if(this.dot_text != 0){
				this.has_notReadMsg = true;
			}else{
				this.has_notReadMsg = false;
			}
			this.base_set = uni.getStorageSync('base_set');
			if(this.base_set.smallapp.is_sh == 1){
				this.mpsh = true
			}else if(this.base_set.smallapp.is_sh == 0){
				// #ifdef MP-WEIXIN || H5 || APP-PLUS
				this.mpsh = false
				// this.footerList = [
				// 	{
				// 		icon: '/static/andy-ADTabbar/home.png',
				// 		icon2: '/static/andy-ADTabbar/home2.png',
				// 		name: '首页',
				// 		footer_ind: 1,
				// 		page_route: '/pages/index/index'
				// 	},
				// 	{
				// 		icon: '/static/andy-ADTabbar/shop.png',
				// 		icon2: '/static/andy-ADTabbar/shop2.png',
				// 		name: '商城',
				// 		footer_ind: 2,
				// 		page_route: '/pages/mall/shopping/shopping'
				// 	},
				// 	{
				// 		icon: '/static/andy-ADTabbar/video.png',
				// 		icon2: '/static/andy-ADTabbar/video2.png',
				// 		name: '精选',
				// 		footer_ind: 3,
				// 		page_route: '/pages/course-list/course-list'
				// 	},
				// 	{
				// 		icon: '/static/andy-ADTabbar/msg.png',
				// 		icon2: '/static/andy-ADTabbar/msg2.png',
				// 		name: '消息',
				// 		footer_ind: 4,
				// 		page_route: '/pages/message/message'
				// 	},
				// 	{
				// 		icon: '/static/andy-ADTabbar/my.png',
				// 		icon2: '/static/andy-ADTabbar/my2.png',
				// 		name: '我的',
				// 		footer_ind: 5,
				// 		page_route: '/pages/user/user'
				// 	}
				// ]
				// #endif
			}
		},
		methods:{
			handleChangeCurrentPage(item) {
				this.current_ind = item.footer_ind
				uni.redirectTo({
					url: item.page_route
				})
			},
		}
	}
</script>

<style lang="less">
	.newstyle1{
		width: 25% !important;
	}
	.box{
		z-index: 9999999;
		height: 140upx;
		width: 100%;
		position: fixed;
		bottom: 0;
		background: #fff;
		border-top: 1upx solid #eee;
		display: flex;
	}
	.current-page{
		color: #6487F8;
	}
	.nav{
		width: 25%;
		// float: left;
		height: 60upx;
	}
	.itemtt{
		height: 140upx;
		width: 100%;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: space-evenly;
	}
	.icon-img{
		width: 40upx;
		height: 40upx;
	}
	.texttt{
		width: 100%;
		text-align: center;
		color: #9B9B9B;
		font-size: 12px;
	}
</style>
